﻿<%@ Page Title="" Language="C#" MasterPageFile="~/Common/Master.master" %>

<script runat="server">

</script>

<asp:Content ID="Content1" ContentPlaceHolderID="head" runat="Server">
</asp:Content>
<asp:Content ID="Content2" ContentPlaceHolderID="ContentForm" runat="Server">
</asp:Content>
<asp:Content ID="Content3" ContentPlaceHolderID="ContentHtml" runat="Server">
    <style type="text/css">
        body { background-color: #F5F7F9; }
        .main { width: 100%; }
        .main .w30 { width: 24%; height: 200px; background-color: #fff; border-radius: 5px; margin: 10px 0px 10px 15px; float: left; }

        .main .w30 ._top { height: 49px; border-bottom: 1px solid #E8EAEC; line-height: 49px; padding-left: 10px; }
        .main .w30 ._top .left { float: left; }
        .main .w30 ._top .right { float: right; padding-right: 10px; }

        .main .w30 .content { height: 104px; border-bottom: 1px solid #E8EAEC; padding-left: 10px; }

        .main .w30 .bottom { height: 45px; line-height: 45px; padding-left: 10px; }
        .main .w30 .bottom .left { float: left; }
        .main .w30 .bottom .right { float: right; padding-right: 10px; }


        .main .w50 { width: 47%; min-height: 500px; background-color: #fff; border-radius: 5px; margin: 10px 0px 10px 15px; float: left; }
        .main .w50 ._top { height: 49px; border-bottom: 1px solid #E8EAEC; line-height: 49px; padding-left: 10px; }
        .main .w50 ._top .left { float: left; }
        .main .w50 ._top .right { float: right; padding-right: 10px; }

        .main .w50 .content { padding-left: 10px; }



        .shijian_green { border: 1px solid #C2EEA0; border-radius: 3px; background-color: #F7FFF0; color: #6CCD3D; height: 22px; line-height: 22px; text-align: center; padding: 0px 6px 0 6px; }
        .shijian_blue { border: 1px solid #A2DBFF; border-radius: 3px; background-color: #EAF8FF; color: #3BA1FF; height: 22px; line-height: 22px; text-align: center; padding: 0px 6px 0 6px; }
        .shijian_red { border: 1px solid #FFA39E; border-radius: 3px; background-color: #FFF1F0; color: #F5222D; height: 22px; line-height: 22px; text-align: center; padding: 0px 6px 0 6px; }
    </style>

    <%--<div class="main">
        <div class="w30">
            <div class="_top">
                <div class="left">项目</div>
                <div class="right"><span class="shijian_green">统计</span></div>
            </div>
            <div class="content">
                <div style="font-size: 35px; line-height: 75px;">25,848</div>
                <div style="font-size: 12px; line-height: 30px;">
                    日同比 12.5% <span style="color: red;">&#8593;</span>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
                    周同比 12.5% <span style="color: green;">&#8595;</span>
                </div>
            </div>
            <div class="bottom">
                <div class="left">总项目</div>
                <div class="right">30000</div>
            </div>
        </div>

        <div class="w30">
            <div class="_top">
                <div class="left">现场次数</div>
                <div class="right"><span class="shijian_blue">月</span></div>
            </div>
            <div class="content">
                <div style="font-size: 35px; line-height: 75px;">25,848</div>
                <div style="font-size: 12px; line-height: 30px;">
                    日同比 12.5% <span style="color: red;">&#8593;</span>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
                    周同比 12.5% <span style="color: green;">&#8595;</span>
                </div>
            </div>
            <div class="bottom">
                <div class="left">总项目</div>
                <div class="right">30000</div>
            </div>
        </div>

        <div class="w30">
            <div class="_top">
                <div class="left">现场工时</div>
                <div class="right"><span class="shijian_red">月</span></div>
            </div>
            <div class="content">
                <div style="font-size: 35px; line-height: 75px;">25,848</div>
                <div style="font-size: 12px; line-height: 30px;">
                    日同比 12.5% <span style="color: red;">&#8593;</span>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
                    周同比 12.5% <span style="color: green;">&#8595;</span>
                </div>
            </div>
            <div class="bottom">
                <div class="left">总项目</div>
                <div class="right">30000</div>
            </div>
        </div>

        <div class="w30">
            <div class="_top">
                <div class="left">签到次数</div>
                <div class="right"><span class="shijian_red">月</span></div>
            </div>
            <div class="content">
                <div style="font-size: 35px; line-height: 75px;">25,848</div>
                <div style="font-size: 12px; line-height: 30px;">
                    日同比 12.5% <span style="color: red;">&#8593;</span>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
                    周同比 12.5% <span style="color: green;">&#8595;</span>
                </div>
            </div>
            <div class="bottom">
                <div class="left">总项目</div>
                <div class="right">30000</div>
            </div>
        </div>

    </div>

    <div class="main">
        <div class="w50">
            <div class="_top">
                <div class="left">项目经理现场工时</div>
                <div class="right"><span class="shijian_green">本月</span></div>
            </div>
            <div class="content">
                <div id="tubiao_yue" style="width: 100%; height: 400px;"></div>
            </div>
        </div>
        <div class="w50">
            <div class="_top">
                <div class="left">现场工时</div>
                <div class="right"><span class="shijian_red">年</span></div>
            </div>
            <div class="content">
                <div id="tubiao_nian" style="width: 100%; height: 400px;"></div>
            </div>
        </div>
    </div>--%>
    <script type="text/javascript">
        //var height = $(window).height() - 260;
        //var width = $(window).width();


        //$(".w50").css("height", height + "px");
        //$(".w50").css("width", (width * 0.48 + 12) + "px");
        //$("#tubiao_yue").css("height", (height - 80) + "px");
        //$("#tubiao_nian").css("height", (height - 80) + "px");

        //$(function () {
        //    var dataAxis = [];
        //    var data = [];
        //    for (var i = 1; i <= 10; i++) {
        //        dataAxis.push("经理" + i);

        //        var x = 300;
        //        var y = 50;
        //        var rand = parseInt(Math.random() * (x - y + 1) + y);
        //        data.push(rand);
        //    }
        //    var obj = {
        //        id: "tubiao_yue",
        //        title: "现场工时",
        //        dataAxis: dataAxis,
        //        data: data,
        //        color0: "#38ef7d",
        //        color1: "#11998e"
        //    };
        //    $.fn.Echarts.Bar(obj);

        //    var obj1 = {
        //        id: "tubiao_nian",
        //        title: "现场工时",
        //        dataAxis: ['1月', '2月', '3月', '4月', '5月', '6月', '7月', '8月', '9月', '10月', '11月', '12月'],
        //        data: [52, 200, 334, 390, 330, 220, 52, 200, 334, 390, 330, 220]
        //    };
        //    $.fn.Echarts.Bar(obj1);
        //});
    </script>
</asp:Content>

